
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>实时获取鼠标坐标</title>
  <style>
	*{
		margin: 0;
		padding: 0;
	}
    .area{
      width: 500px;
      height: 350px;
      border: 2px solid royalblue;
    }
  </style>
</head>
<body>
  <div class="area" id="area"></div>
  <span class="val" id="val"></span>
  <script type="text/javascript">
    window.onload = function(){
      document.getElementById('area').onmousemove = function (event) {
        /*
		if(!event){
          event = window.event;
        }
		*/
        // 简写方式
        event = event || window.event;
        document.getElementById('val').innerHTML = '当前位置: ' + event.clientX + ", " + event.clientY;
      }
    };
  </script>
</body>
</html>